<template>
  <a-spin :spinning="confirmLoading">

    <a-card title="应收明细" size="small">
      <j-vxe-table
        ref="receivableTable"
        size="mini"
        toolbar
        row-number
        row-selection
        resizable
        async-remove
        :toolbarConfig="toolbarConfig"
        keep-source
        :loading="confirmLoading"
        :height="350"
        :dataSource="receivableList"
        :columns="receiveCol"
        style="margin-top: 8px;"
        @valueChange="handleValueChange"
        @remove="handleTableRemove"
        @selectRowChange="handleSelectRowChange"
        :edit-config="{trigger: 'click', mode: 'cell', activeMethod: recactiveCellMethod}"
        :export-config="{}"
        :checkbox-config="{checkMethod: recCheckboxkMethod}"
        :cell-style='cellStyle'
        bordered
      >
        <template v-slot:toolbarSuffix>

          <!--        <a-button icon="minus" @click="saveReceForm" v-if="isdelete">删除</a-button>-->
          <a-button @click="saveReceForm" icon="save">保存</a-button>

          <a-button @click="submitBill" ghost type="primary" icon="arrow-up">提交审核</a-button>
          <!--        <a-tooltip placement="top" title="保存后创建账单" :autoAdjustOverflow="true">-->
          <!--          <a-button @click="createReceBill(1)">创建账单</a-button>-->
          <!--        </a-tooltip>-->
          <!--        <a-button type="primary" @click="exportDataEvent(1)" icon="download">-->
          <!--          导出/打印-->
          <!--        </a-button>-->
          <a-button icon="download" @click="showDownModal(1)">
            导出明细
          </a-button>
          <a-button type="primary" icon="copy" @click="goCopy(1)">
            复制为应付
          </a-button>
          <!--        <a-button @click="exportDataEvent(1)">导出/打印</a-button>-->
        </template>

        <template v-slot:action="props">
          <a-select style="width: 180px" placeholder="请选择" :allowClear="true" v-model="props.row.costName"
                    :disabled='props.row.scode == 1?false:true'>
            <a-select-option v-for="(item, key) in feeNameData" :key="key" :value="item.value">
              {{ item.text }}
            </a-select-option>
          </a-select>
        </template>

        <template v-slot:jsdw="props">
          <a-select style="width: 180px" placeholder="请选择" :allowClear="true" v-model="props.row.settlementCompany"
                    :disabled='props.row.scode == 1?false:true'>
            <a-select-option v-for="(item, key) in companyData" :key="key" :value="item.value">
              {{ item.text }}
            </a-select-option>
          </a-select>
        </template>

      </j-vxe-table>
    </a-card>

    <a-card title="应付明细" size="small">
      <j-vxe-table
        ref="payTable"
        size="mini"
        toolbar
        resizable
        row-number
        row-selection
        async-remove
        :loading="confirmLoading"
        keep-source
        :height="350"
        :dataSource="payList"
        :columns="payCol"
        style="margin-top: 8px;"
        @valueChange="handleValueChange"
        @remove="handleTableRemove"
        @selectRowChange="handleSelectRowChange2"
        :checkbox-config="{checkMethod: payCheckboxkMethod}"
        :edit-config="{trigger: 'click', mode: 'cell', activeMethod: payactiveCellMethod}"
        :cell-style='cellStyle'
        bordered
      >
        <template v-slot:toolbarSuffix>
          <a-button @click="savePayForm" icon="save">保存</a-button>

          <a-button @click="submitsh2" ghost type="primary" icon="arrow-up">提交审核</a-button>
          <!--        <a-tooltip placement="top" title="保存后创建账单" :autoAdjustOverflow="true">-->
          <!--          <a-button @click="createReceBill(2)">创建账单</a-button>-->
          <!--         -->
          <!--        </a-tooltip>-->
          <!--        <a-button @click="exportDataEvent(2)" icon="download" type="primary">导出/打印</a-button>-->
          <a-button icon="download" @click="showDownModal(2)">
            导出明细
          </a-button>
          <a-button type="primary" icon="copy" @click="goCopy(2)">
            复制为应收
          </a-button>
        </template>


        <template v-slot:action="props">
          <a-select style="width: 180px" placeholder="请选择" :allowClear="true" v-model="props.row.costName"
                    :disabled='props.row.scode == 1?false:true'>
            <a-select-option v-for="(item, selkey) in feeNameData" :key="selkey" :value="item.value">
              {{ item.text }}
            </a-select-option>
          </a-select>

        </template>
        <template v-slot:jsdw="props">
          <a-select style="width: 180px" placeholder="请选择" :allowClear="true" v-model="props.row.settlementCompany"
                    :disabled='props.row.scode == 1?false:true'>
            <a-select-option v-for="(item, key) in companyData" :key="key" :value="item.value">
              {{ item.text }}
            </a-select-option>
          </a-select>
        </template>
      </j-vxe-table>
    </a-card>
    <div>
      <a-modal v-model="selectDownVisible" title="导出费用" ok-text="确认" cancel-text="取消" @ok="hideDownModal">
        <div>
          选择公司：
          <a-select v-model="downcom" style="width: 300px">

            <a-select-option value="1">
              青岛大金汇国际货运有限公司
            </a-select-option>
            <a-select-option value="2">
              青岛海那威尔物流有限公司
            </a-select-option>
          </a-select>
        </div>
        <div style="margin-top: 10px">
          账单类型：
          <a-select v-model="downtype" style="width: 300px">
            <a-select-option value="0">
              中文账单
            </a-select-option>
            <a-select-option value="1" v-if="feeType==1">
              英文账单
            </a-select-option>
          </a-select>
        </div>
        <!--        <div style="margin-top: 10px">-->
        <!--          导出类型：-->
        <!--          <a-select v-model="downfiletype" style="width: 300px">-->

        <!--            <a-select-option value="0">-->
        <!--              Word(*.docx)-->
        <!--            </a-select-option>-->
        <!--            <a-select-option value="1">-->
        <!--              PDF-->
        <!--            </a-select-option>-->
        <!--          </a-select>-->
        <!--        </div>-->
      </a-modal>
      <div style="margin-top: 30px"></div>
      <div
        :style="{
          // position: 'absolute',
          right: 0,
          bottom: 0,
          width: '100%',
          borderTop: '1px solid #e9e9e9',
          padding: '10px 16px',
          background: '#fff',
          textAlign: 'right',
          zIndex: 999,
        }"
      >
        <a-button :style="{ marginRight: '8px' }" @click="allclose">
          关闭
        </a-button>
        <!--      <a-button type="primary" @click="handleOk">-->
        <!--        保存-->
        <!--      </a-button>-->
      </div>
      <!--    <a-modal-->
      <!--      title="添加费用名称"-->
      <!--      :visible="costModalVisible"-->
      <!--      :maskClosable="false"-->
      <!--      :confirm-loading='confirmLoading'-->
      <!--      @ok="addHandleOkCost"-->
      <!--      @cancel="addHandleCancelCost"-->
      <!--    >-->
      <!--      <a-input placeholder="请输入费用名称" v-model="costName" :allowClear=true></a-input>-->
      <!--      <a-input style="margin-top: 30px" placeholder="请输入费用代码" v-model="costCode" :allowClear=true></a-input>-->
      <!--    </a-modal>-->

      <!--    <a-modal-->
      <!--      :title="billModalTitle"-->
      <!--      :width="900"-->
      <!--      :visible="billModalVisible"-->
      <!--      :confirm-loading='billConfirmLoading'-->
      <!--      :maskClosable="false"-->
      <!--      @ok="billModalAddHandleOk"-->
      <!--      @cancel="billModalAddHandleCancel">-->
      <!--      <BillForm ref="billForm"-->
      <!--                @cb="createBillCallback"-->
      <!--                :total-price="totalPrice"-->
      <!--                :formId="modelId"-->
      <!--                :data-source="billDataSource">-->

      <!--      </BillForm>-->
      <!--    </a-modal>-->
    </div>
  </a-spin>

</template>

<script>
import BillForm from '@/views/jzxtrade/modules/BillForm'
import { getAction, httpAction } from '@/api/manage'
import JFormContainer from '@/components/jeecg/JFormContainer'

import { JVXETypes } from '@/components/jeecg/JVxeTable'
import { postAction } from '../../../api/manage'

export default {

  name: 'ExpenseEntryForm',
  components: {
    JFormContainer,
    BillForm,
    VNodes: {
      functional: true,
      render: (h, ctx) => ctx.props.vnodes
    }
  },
  props: {},
  data() {
    return {
      selectDownVisible: false,
      downcom: '1',
      downtype: '0',
      downfiletype: '0',
      feeNameData: [],
      companyData: [],
      selectedRowKeys: [],
      toolbarConfig: {
        // add 新增按钮； @remove="handleTableRemove" 删除按钮；clearSelection 清空选择按钮
        btn: ['add', 'remove']
      },
      isdelete: false,
      billModalTitle: '',
      billModalVisible: false,
      billConfirmLoading: false,
      billDataSource: [],
      totalPrice: '0',
      //费用名称
      costNames: [],
      costName: '',
      costCode: '',
      costModalVisible: false,
      receivableList: [],
      payList: [],
      confirmLoading: false,
      modelId: '',
      receiveCol: [
        {
          title: '费用状态',
          key: 'status',
          type: JVXETypes.normal,
          width: '150px',
          defaultValue: '录入状态'
        },
        {
          title: '费用名称',
          key: 'costName',
          type: JVXETypes.slot,
          width: '200px',
          align: 'center',
          slotName: 'action',
          validateRules: [{ required: true, message: '${title}不能为空' }]
        },
        {
          title: '结算单位',
          key: 'settlementCompany',
          type: JVXETypes.slot,
          slotName: 'jsdw',
          width: '220px',
          placeholder: '请选择',
          validateRules: [{ required: true, message: '${title}不能为空' }]
        },
        {
          title: '计费单位',
          key: 'chargingUnit',
          type: JVXETypes.select,
          width: '180px',
          dictCode: 'billing_unit',
          placeholder: '请选择',
          validateRules: [{ required: true, message: '${title}不能为空' }]
        },

        {
          title: '币种',
          key: 'currency',
          type: JVXETypes.select,
          width: '180px',
          dictCode: 'currency',
          placeholder: '请选择',
          validateRules: [{ required: true, message: '${title}不能为空' }]
        },

        {
          title: '单价',
          key: 'price',
          type: JVXETypes.inputNumber,
          width: '180px',
          defaultValue: 0,
          validateRules: [
            {
              required: true,
              message: '${title}不能为空'
            },
            {
              pattern: /^(?!(0[0-9]{0,}$))[0-9]{1,}[.]{0,}[0-9]{0,}$/,
              message: '${title}必须大于0'
            }]
        },
        {
          title: '数量',
          key: 'num',
          type: JVXETypes.inputNumber,
          width: '180px',
          defaultValue: 1

        },
        {
          title: '汇率',
          key: 'rate',
          type: JVXETypes.inputNumber,
          width: '180px',
          defaultValue: 1
        },
        {
          title: '总价',
          key: 'totalPrice',
          type: JVXETypes.normal,
          width: '180px',
          defaultValue: '0',
          statistics: ['sum']
        },
        {
          title: '本位币金额',
          key: 'cnyAmount',
          type: JVXETypes.normal,
          width: '200px',
          defaultValue: '0',
          statistics: ['sum']
        },
        // {
        //   title: '账单号',
        //   key: 'billNumber',
        //   type: JVXETypes.normal,
        //   width: '200px',
        //   placeholder: '请输入${title}',
        //   defaultValue: ''
        // },
        {
          title: '发票号',
          key: 'invoiceNumber',
          type: JVXETypes.normal,
          width: '200px',
          placeholder: '请输入${title}',
          defaultValue: ''
        },
        {
          title: '备注',
          key: 'remark',
          type: JVXETypes.input,
          width: '200px',
          placeholder: '请输入${title}',
          defaultValue: ''
        },
        {
          title: '状态',
          key: 'scode',
          type: JVXETypes.hidden,
          defaultValue: 1
        },
        {
          title: '业务类型',
          key: 'buisType',
          type: JVXETypes.hidden,
          defaultValue: 1
        }
      ],
      payCol: [
        {
          title: '费用状态',
          key: 'status',
          type: JVXETypes.normal,
          width: '150px',
          defaultValue: '录入状态'
        },
        {
          title: '费用名称',
          key: 'costName',
          type: JVXETypes.slot,
          width: '200px',
          align: 'center',
          slotName: 'action',
          validateRules: [{ required: true, message: '${title}不能为空' }]
        },
        {
          title: '结算单位',
          key: 'settlementCompany',
          type: JVXETypes.slot,
          slotName: 'jsdw',
          width: '220px',
          placeholder: '请选择',
          validateRules: [{ required: true, message: '${title}不能为空' }]
        },
        {
          title: '计费单位',
          key: 'chargingUnit',
          type: JVXETypes.select,
          width: '180px',
          dictCode: 'billing_unit',
          placeholder: '请选择',
          validateRules: [{ required: true, message: '${title}不能为空' }]
        },

        {
          title: '币种',
          key: 'currency',
          type: JVXETypes.select,
          width: '180px',
          dictCode: 'currency',
          placeholder: '请选择',
          validateRules: [{ required: true, message: '${title}不能为空' }]
        },

        {
          title: '单价',
          key: 'price',
          type: JVXETypes.inputNumber,
          width: '180px',
          defaultValue: 0,
          validateRules: [
            {
              required: true,
              message: '${title}不能为空'
            },
            {
              pattern: /^(?!(0[0-9]{0,}$))[0-9]{1,}[.]{0,}[0-9]{0,}$/,
              message: '${title}必须大于0'
            }]
        },
        {
          title: '数量',
          key: 'num',
          type: JVXETypes.inputNumber,
          width: '180px',
          defaultValue: 1
        },
        {
          title: '汇率',
          key: 'rate',
          type: JVXETypes.inputNumber,
          width: '180px',
          defaultValue: 1
        },
        {
          title: '总价',
          key: 'totalPrice',
          type: JVXETypes.normal,
          width: '180px',
          defaultValue: '0',
          statistics: ['sum']
        },
        {
          title: '本位币金额',
          key: 'cnyAmount',
          type: JVXETypes.normal,
          width: '200px',
          defaultValue: '0',
          statistics: ['sum']
        },
        // {
        //   title: '账单号',
        //   key: 'billNumber',
        //   type: JVXETypes.normal,
        //   width: '200px',
        //   placeholder: '请输入${title}',
        //   defaultValue: ''
        // },
        {
          title: '发票号',
          key: 'invoiceNumber',
          type: JVXETypes.normal,
          width: '200px',
          placeholder: '请输入${title}',
          defaultValue: ''
        },
        {
          title: '备注',
          key: 'remark',
          type: JVXETypes.input,
          width: '200px',
          placeholder: '请输入${title}',
          defaultValue: ''
        },
        {
          title: '状态',
          key: 'scode',
          type: JVXETypes.hidden,
          defaultValue: 1
        },
        {
          title: '业务类型',
          key: 'buisType',
          type: JVXETypes.hidden,
          defaultValue: 1
        }

      ],
      url: {
        save: '/box.ship/shipInfo/cost/add',
        queryById: '/box.ship/shipInfo/cost/queryByShipId',

        deleteurl: '/box.ship/shipInfo/cost/del',
        submiturl: '/box.ship/shipInfo/cost/submit/check'
      },
      receiveCellEdit: true,
      // 选择的行
      selectedRows: [],
      selectedRows2: [],
      baseInfo: {},
      feeType: 1
    }
  },
  computed: {},
  created() {
    this.initDict()
  },
  beforeCreate() {
    // this.form = this.$form.createForm(this, { name: 'dynamic_form_item' });
    // this.form.getFieldDecorator('boxType', { initialValue: [], preserve: true });

    // this.form.getFieldDecorator('keys', { initialValue: [], preserve: true });
  },
  methods: {
    // billModalAddHandleCancel(e) {
    //   this.billConfirmLoading = false
    //   this.billModalVisible = false
    // },
    // billModalAddHandleOk(e) {
    //   this.$refs.billForm.submitBillInfo()
    // },
    // createBillCallback(e, ids, billNumber) {
    //   this.selectedRows = []
    //   this.selectedRows2 = []
    //   if (e) {
    //     this.selectAll()
    //     this.billConfirmLoading = false
    //     this.billModalVisible = false
    //   } else {
    //     this.$message.warn('表单信息填写不完整')
    //   }
    //
    // },
    onSelectChange(val) {
      console.log(val)

    },
    /**
     * 提交审核
     */
    submitBill() {
      if (this.selectedRows.length == 0) {
        this.$message.warn('请选择要提交审核的费用')
      } else {
        let that = this
        let ids = []
        let tempSettlementCompany = ''
        let isGo = false
        for (let i = 0; i < this.selectedRows.length; i++) {
          if (tempSettlementCompany == '') {
            tempSettlementCompany = this.selectedRows[i].settlementCompany
          }
          if (this.selectedRows[i].settlementCompany != tempSettlementCompany) {
            this.$message.warn('请选择同一结算单位创建账单')
            isGo = true
            break
          }
          if (this.selectedRows[i].scode > 1) {
            this.$message.warn('请选择录入状态的费用进行提交')
            isGo = true
            break
          }
          ids.push(this.selectedRows[i].id)
        }
        if (!isGo) {
          // 先保存
          this.$refs.receivableTable.validateTable().then(errMap => {
            if (!errMap) {
              this.receivableList = this.$refs.receivableTable.getTableData()
              let formData = {
                costInfoList: this.receivableList,
                shipId: that.modelId,
                type: 'ys'
              }
              this.confirmLoading = true
              httpAction(this.url.save, formData, 'post').then((res) => {
                if (res.success) {
                  //再提交审核
                  let param = {
                    ids: ids
                  }
                  postAction(this.url.submiturl, param).then(res => {
                    if (res.success) {
                      this.$refs.receivableTable.clearSelection()
                      this.$message.success(res.message)
                      this.selectAll()
                    } else {
                      this.$message.warning(res.message)
                    }
                  }).finally(() => {
                  })
                  // that.$emit('allOk')
                } else {
                  this.$message.warning(res.message)
                }
              }).finally(() => {
                this.confirmLoading = false
              })
            } else {
              // 验证未通过，errMap里包含具体未验证通过的详情
              this.$message.error('数据不完整')
            }
          })
        }
      }

    },
    submitsh2() {
      if (this.selectedRows2.length == 0) {
        this.$message.warn('请选择要提交审核的费用')
      } else {
        let that = this
        let ids = []
        let tempSettlementCompany = ''
        let isGo = false
        for (let i = 0; i < this.selectedRows2.length; i++) {
          if (tempSettlementCompany == '') {
            tempSettlementCompany = this.selectedRows2[i].settlementCompany
          }
          if (this.selectedRows2[i].settlementCompany != tempSettlementCompany) {
            this.$message.warn('请选择同一结算单位创建账单')
            isGo = true
            break
          }
          if (this.selectedRows2[i].scode > 1) {
            this.$message.warn('请选择录入状态的费用进行提交')
            isGo = true
            break
          }
          ids.push(this.selectedRows2[i].id)
        }
        if (!isGo) {
          // 先保存
          this.$refs.payTable.validateTable().then(errMap => {
            if (!errMap) {
              this.payList = this.$refs.payTable.getTableData()
              let formData = {
                costInfoList: this.payList,
                shipId: that.modelId,
                type: 'yf'
              }
              this.confirmLoading = true
              httpAction(this.url.save, formData, 'post').then((res) => {
                if (res.success) {
                  //再提交审核
                  let param = {
                    ids: ids
                  }
                  postAction(this.url.submiturl, param).then(res => {
                    if (res.success) {
                      this.$refs.payTable.clearSelection()
                      this.$message.success(res.message)
                      this.selectAll()
                    } else {
                      this.$message.warning(res.message)
                    }
                  }).finally(() => {
                  })
                  // that.$emit('allOk')
                } else {
                  this.$message.warning(res.message)
                }
              }).finally(() => {
                this.confirmLoading = false
              })
            } else {
              // 验证未通过，errMap里包含具体未验证通过的详情
              this.$message.error('数据不完整')
            }
          })
        }
      }
    },
    // 触发单元格删除事件
    handleTableRemove(event) {
      let that = this
      console.log('待删除的数据: ', event.deleteRows)
      let ids = []
      let isGo = true
      for (var i = 0; i < event.deleteRows.length; i++) {
        if (event.deleteRows[i].scode != 1) {
          isGo = false
          break
        }
        ids.push(event.deleteRows[i].id)
      }
      if (isGo) {
        let param = { ids: ids }
        that.confirmLoading = true
        postAction(this.url.deleteurl, param).then(res => {
          console.log(res)
          if (res.success) {
            that.$message.success(res.message)
            // that.$emit('allOk')

            that.selectAll()
          } else {
            that.$message.warning(res.message)
          }
        }).finally(() => {
          that.confirmLoading = false
        })
      } else {
        this.$message.warning('只有录入状态的费用才能删除')
      }

    },
    // 当选择的行变化时触发的事件
    handleSelectRowChange(event) {
      this.selectedRows = event.selectedRows
    },
    // 当选择的行变化时触发的事件
    handleSelectRowChange2(event) {
      this.selectedRows2 = event.selectedRows
    },
    //获取海运单号ID
    questId(id, baseInfo) {
      console.log('id:' + id)
      this.modelId = id
      this.baseInfo = baseInfo
      this.selectAll(id)

    },
    selectAll() {
      var that = this
      that.confirmLoading = true
      let params = { 'shipId': this.modelId }
      getAction(this.url.queryById, params).then((res) => {
        if (res.success) {
          that.receivableList = res.result.ysList
          that.payList = res.result.yfList
        } else {
          that.$message.warning(res.message)
        }
      }).finally(() => {
        that.confirmLoading = false
      })
    },
    initDict() {
      let param = { isLock: 0, pageSize: 99999 }
      getAction('/fee/list', param).then(res => {
        let feeData = []
        for (let i = 0; i < res.result.length; i++) {
          feeData.push({
            value: res.result[i].feeName,
            text: res.result[i].feeName
          })
        }
        this.feeNameData = feeData
      })
      getAction('/companydata/list', param).then(res => {
        let companyDataList = []
        for (let i = 0; i < res.result.records.length; i++) {
          companyDataList.push({
            value: res.result.records[i].companyName,
            text: res.result.records[i].companyName
          })
        }
        this.companyData = companyDataList
      })
    },
    saveReceForm() {
      // 进行表单验证
      this.$refs.receivableTable.validateTable().then(errMap => {
        if (!errMap) {
          console.log(this.$refs.receivableTable.getTableData())
          const that = this
          this.receivableList = this.$refs.receivableTable.getTableData()
          let formData = {
            costInfoList: this.receivableList,
            shipId: that.modelId,
            type: 'ys'
          }
          console.log(formData)
          that.confirmLoading = true
          httpAction(this.url.save, formData, 'post').then((res) => {
            if (res.success) {
              that.$message.success(res.message)
              // that.$emit('allOk')

              that.selectAll()
            } else {
              that.$message.warning(res.message)
            }
          }).finally(() => {
            that.confirmLoading = false
          })
        } else {
          // 验证未通过，errMap里包含具体未验证通过的详情
          this.$message.error('数据不完整')

        }
      })

    },
    savePayForm() {
      // 进行表单验证
      this.$refs.payTable.validateTable().then(errMap => {
        if (!errMap) {

          console.log(this.$refs.payTable.getTableData())
          const that = this
          this.payList = this.$refs.payTable.getTableData()
          let formData = {
            costInfoList: this.payList,
            shipId: that.modelId,
            type: 'yf'
          }
          console.log(formData)

          that.confirmLoading = true
          httpAction(this.url.save, formData, 'post').then((res) => {
            if (res.success) {
              that.$message.success(res.message)
              // that.$emit('allOk')

              that.selectAll()
            } else {
              that.$message.warning(res.message)
            }
          }).finally(() => {
            that.confirmLoading = false
          })

        } else {
          // 验证未通过，errMap里包含具体未验证通过的详情
          this.$message.error('数据不完整')

        }
      })

    },
    allclose() {
      this.$emit('allclose')
    },
    addCostItem() {
      this.costModalVisible = true
      this.costName = ''
      this.costCode = ''

    },
    addHandleCancelCost() {
      this.costModalVisible = false
      this.costName = ''
    },
    handleValueChange(event) {
      console.log('handleValueChange.event: ', event)
      if (event.col.key == 'price') {
        let allprice = (event.value * event.row.num).toFixed(2)
        let allcny = (event.value * event.row.num * event.row.rate).toFixed(2)
        // console.log(' price allprice: ', allprice)
        // console.log(' price allcny: ', allcny)
        event.row.totalPrice = allprice
        event.row.cnyAmount = allcny
        event.resetValue

      } else if (event.col.key == 'num') {
        let allprice = (event.value * event.row.price).toFixed(2)
        let allcny = (event.value * event.row.price * event.row.rate).toFixed(2)
        // console.log(' num allprice: ', allprice)
        // console.log(' num allcny: ', allcny)
        event.row.totalPrice = allprice
        event.row.cnyAmount = allcny
        event.resetValue

      } else if (event.col.key == 'rate') {
        let allcny = (event.value * event.row.price * event.row.num).toFixed(2)
        event.row.cnyAmount = allcny
        event.resetValue
        // console.log(' num rate: ', allcny)
      } else if (event.col.key == 'currency') {
        getAction('https://api.it120.cc/ddd/forex/rate?fromCode=CNY&toCode=' + event.value, null).then((res) => {
          if (res.msg == 'success') {
            event.row.rate = res.data.rate ? res.data.rate : 0
            event.row.cnyAmount = (event.row.num * event.row.price * event.row.rate).toFixed(2)
            event.resetValue
          }
        })
      }

    },
    goCopy(val) {
      if (val == 1) {
        if (this.selectedRows.length == 0) {
          this.$message.warn('请选择要复制的费用')
        } else {
          let tempDataList = this.payList.concat(this.selectedRows)
          this.payList = tempDataList
          this.$message.success('复制成功')
          this.$refs.receivableTable.clearSelection()
        }
      } else if (val == 2) {
        if (this.selectedRows2.length == 0) {
          this.$message.warn('请选择要复制的费用')
        } else {
          let temList = this.receivableList.concat(this.selectedRows2)
          this.receivableList = temList
          this.$message.success('复制成功')
          this.$refs.payTable.clearSelection()
        }
      }

    },
    recCheckboxkMethod({ row }) {
      return row.scode == 1
    },
    recactiveCellMethod({ row, rowIndex }) {
      if (row.scode == 1) {
        return true
      }
      return false
    },
    payCheckboxkMethod({ row }) {
      return row.scode == 1
    },
    payactiveCellMethod({ row, rowIndex }) {
      if (row.scode == 1) {
        return true
      }
      return false
    },
    // exportDataEvent(val) {
    //   if (val == 1) {
    //     this.$refs.receivableTable.openExport({ types: ['csv'] })
    //   } else if (val == 2) {
    //     this.$refs.payTable.openExport({ types: ['csv'] })
    //   }
    // },
    cellStyle(row) {

      // console.log(row.row);
      if (row.row.scode == 2) {//判断条件，如果想要改变其他行样式，就写那一行的下标
        return `background-color: #fff1cf !important; `
      } else if (row.row.scode == 3 || row.row.scode == 4 || row.row.scode == 5) {//判断条件，如果想要改变其他行样式，就写那一行的下标
        return `background-color: #9bcb40 !important; color: #777777`
      } else if (row.row.scode == 6 || row.row.scode == 7) {//判断条件，如果想要改变其他行样式，就写那一行的下标
        return `background-color: #8acff8 !important; color: #777777`
      } else {
        return ``
      }
    },
    showDownModal(t) {
      this.selectDownVisible = true
      this.feeType = t
    },
    hideDownModal() {
      if (this.feeType == 2) {
        window.open('http://123.57.86.213:18080/RDP-SERVER/rdppage/main/80d732e49862d183ceee0173de281f67?id=' + this.modelId + '&type=' + this.downcom,
          'windowname',
          'top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no')
      } else {
        if (this.downtype == 1) {
          window.open('http://123.57.86.213:18080/RDP-SERVER/rdppage/main/79e62563a36600f00962581931380dba?id=' + this.modelId + '&type=' + this.downcom,
            'windowname',
            'top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no')
        } else {
          window.open('http://123.57.86.213:18080/RDP-SERVER/rdppage/main/86524284e9293a4661eac37a6eb9cd27?id=' + this.modelId + '&type=' + this.downcom,
            'windowname',
            ' top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no')
        }
      }

      this.selectDownVisible = false
    }
    // ep(t, name) {
    //   let selectData = []
    //   if (t == 1) {
    //     selectData = this.selectedRows
    //   } else if (t == 2) {
    //     selectData = this.selectedRows2
    //   }
    //   if (selectData.length == 0) {
    //     this.$message.warning('请选择要导出的数据')
    //   } else {
    //     let _this = this
    //     // 读取并获得模板文件的二进制内容
    //     JSZipUtils.getBinaryContent(name, function(error, content) {
    //       // input.docx是模板。我们在导出的时候，会根据此模板来导出对应的数据
    //       // 抛出异常
    //       if (error) {
    //         throw error
    //       }
    //
    //       // 创建一个JSZip实例，内容为模板的内容
    //       let zip = new JSZip(content)
    //       // 创建并加载docxtemplater实例对象
    //       let doc = new window.docxtemplater().loadZip(zip)
    //       let feeBaseData = {
    //         operator: _this.baseInfo.operator ? _this.baseInfo.operator : '',
    //         mainOffNumber: _this.baseInfo.mainOffNumber ? _this.baseInfo.mainOffNumber : '',
    //         customerNumber: _this.baseInfo.customerNumber ? _this.baseInfo.customerNumber : '',
    //         shipName: _this.baseInfo.shipName ? _this.baseInfo.shipName : '',
    //         voyageNumber: _this.baseInfo.voyageNumber ? _this.baseInfo.voyageNumber : '',
    //         etd: _this.baseInfo.etd ? _this.baseInfo.etd : '',
    //         polRemark: _this.baseInfo.polRemark ? _this.baseInfo.polRemark : '',
    //         placeDeliveryDesc: _this.baseInfo.placeDeliveryDesc ? _this.baseInfo.placeDeliveryDesc : '',
    //         boxSize: _this.baseInfo.boxSize ? _this.baseInfo.boxSize : '',
    //         total: _this.baseInfo.total ? _this.baseInfo.total : '',
    //         totalGrossWeight: _this.baseInfo.totalGrossWeight ? _this.baseInfo.totalGrossWeight : '',
    //         totalVolume: _this.baseInfo.totalVolume ? _this.baseInfo.totalVolume : '',
    //         jsdw: selectData[0].settlementCompany
    //       }
    //       // 设置模板变量的值
    //       doc.setData({
    //         ...feeBaseData,
    //         table: selectData
    //       })
    //
    //       try {
    //         // 用模板变量的值替换所有模板变量
    //         doc.render()
    //       } catch (error) {
    //         // 抛出异常
    //         let e = {
    //           message: error.message,
    //           name: error.name,
    //           stack: error.stack,
    //           properties: error.properties
    //         }
    //         console.log(JSON.stringify({ error: e }))
    //         throw error
    //       }
    //       // 生成一个代表docxtemplater对象的zip文件（不是一个真实的文件，而是在内存中的表示）
    //       let out = doc.getZip().generate({
    //         type: 'blob',
    //         mimeType:
    //           'application/vnd.openxmlformats-officedocument.wordprocessingml.document'
    //       })
    //       let objectUrl = URL.createObjectURL(out)
    //       console.log(objectUrl)
    //       // 将目标文件对象保存为目标类型的文件，并命名
    //       saveAs(out, selectData[0].settlementCompany + '_应收明细费用账单.docx')
    //     })
    //   }
    // }
  }
}

</script>

<style lang="less" scoped>

</style>